<template>
  <el-dialog :title="`${form.standardId ? '修改' : '添加'}验收标准`" :visible.sync="show" :close-on-click-modal="false" :show-close="!btnLoading" width="600px" @closed="closed"
             append-to-body>
    <el-form ref="form" :model="form" :rules="rules" size="small" label-width="100px">
      <el-form-item prop="standardId" class="hide" />
      <el-form-item prop="evalCategoryId" class="hide" />
      <el-form-item prop="courseId" class="hide" />
      <el-form-item prop="scId" class="hide" />
      <el-form-item prop="tableId" class="hide" />
      <el-form-item :label="showParentLabel" :class="{ hide: !showParentLabel }">{{ showParentName }}</el-form-item>
      <el-form-item label="验收标准内容" prop="content"><el-input v-model="form.content" type="textarea" placeholder="请输入验收标准内容" :maxlength="3000" /></el-form-item>
      <el-row>
        <el-col :span="12">
          <el-form-item label="过程分类" prop="rdcCourses">
            <el-select v-model="rdcCoursesSelect" placeholder="请选择" multiple collapse-tags style="width: 100%">
              <el-option v-for="dict in dict.type.cq_process_type" :key="dict.value" :label="dict.label" :value="dict.value" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="严重等级" prop="seriousLevel">
            <el-select v-model="form.seriousLevel" placeholder="请选择严重等级" default-first-option filterable style="width: 100%">
              <el-option v-for="dict in dict.type.sys_standard_type" :key="dict.value" :label="dict.label" :value="dict.value" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="模块" prop="modules">
            <el-select v-model="form.modules" placeholder="请选择模块" default-first-option filterable style="width: 100%">
              <el-option v-for="dict in dict.type.cq_data_modules" :key="dict.value" :label="dict.label" :value="dict.value" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="分块" prop="blocks">
            <el-select v-model="form.blocks" placeholder="请选择分块" default-first-option filterable clearable style="width: 100%">
              <el-option v-for="dict in dict.type.cq_data_blocks" :key="dict.value" :label="dict.label" :value="dict.value" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="部位" prop="positions">
            <el-select v-model="form.positions" placeholder="请选择部位" default-first-option filterable clearable style="width: 100%">
              <el-option v-for="dict in dict.type.cq_data_positions" :key="dict.value" :label="dict.label" :value="dict.value" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="数据归集" prop="dataCollections">
            <el-select v-model="form.dataCollections" placeholder="请选择数据归集" default-first-option filterable clearable style="width: 100%">
              <el-option v-for="(dict, index) in dict.type.cq_data_collections" :key="index + '_' + dict.value" :label="dict.label" :value="dict.value" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="质量下属分类" prop="locationType" :rules="[{ required: locationTypeRequired, message: '请选择质量下属分类' }]">
            <el-select v-model="form.locationType" placeholder="请选择质量下属分类" default-first-option filterable clearable style="width: 100%">
              <el-option v-for="dict in dict.type.cq_location_type" :key="dict.value" :label="dict.label" :value="dict.value" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="排序" prop="seq"><el-input-number v-model="form.seq" :min="0" :max="1e8" :precision="0" controls-position="right" style="width: 100%" /></el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="是否启用" prop="isEnable"><el-switch v-model="form.isEnable" :active-value="1" :inactive-value="0" /></el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="是否严控项" prop="isEnable"><el-switch v-model="form.isStrict" :active-value="1" :inactive-value="0" /></el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="备注" prop="remark"><el-input v-model="form.remark" type="textarea" placeholder="请输入内容" :maxlength="255" /></el-form-item>
    </el-form>
    <div slot="footer">
      <el-button type="primary" :loading="btnLoading" @click="btnSubmit">确 定</el-button>
      <el-button :disabled="btnLoading" @click="show = false">取 消</el-button>
    </div>
  </el-dialog>
</template>
<script>
// 添加或修改验收标准对话框
import { editFormMixin } from '@/utils/mixin'
import { addCheckStandard, updateCheckStandard } from '@/api/qualityManage/cq'
export default {
  mixins: [editFormMixin],
  dicts: ['sys_standard_type', 'cq_data_modules', 'cq_data_blocks', 'cq_data_positions', 'cq_data_collections', 'cq_process_type', 'cq_location_type'],
  data() {
    return {
      primaryKey: 'standardId',
      addApi: addCheckStandard,
      updateApi: updateCheckStandard,
      form: {
        chkitemType: '',
        evalCategoryId: '',
        courseId: '',
        scId: '',
        tableId: '',
        standardId: '',
        content: '',
        rdcCourses: '',
        seriousLevel: '',
        modules: '',
        blocks: '',
        positions: '',
        dataCollections: '',
        locationType: '',
        remark: '',
        seq: 0,
        isEnable: 1
      },
      rules: {
        content: [{ required: true, message: '请输入验收标准内容' }],
        // rdcCourses: [{ required: true, message: '请选择过程分类' }],
        seriousLevel: [{ required: true, message: '请选择严重等级' }],
        modules: [{ required: true, message: '请选择模块' }]
        // blocks: [{ required: true, message: '请选择分块' }],
        // positions: [{ required: true, message: '请选择部位' }],
        // dataCollections: [{ required: true, message: '请选择数据归集' }]
      },
      checkTableList: []
    }
  },
  computed: {
    rdcCoursesSelect: {
      get() {
        const str = this.form.rdcCourses || ''
        return str.split(',').filter(i => i)
      },
      set(val) {
        this.form.rdcCourses = val.sort().join(',')
      }
    },
    showParentLabel() {
      const { evalCategoryId, courseId, scId, tableId } = this.form
      return evalCategoryId ? '检查类别' : courseId ? '抽检流程' : scId ? '安全文明' : tableId ? '工序' : ''
    },
    showParentName() {
      const { evalCategoryId, courseId, scId, tableId } = this.form
      if (evalCategoryId) {
        const item = this.checkTableList.find(i => i.evalCategoryId === evalCategoryId)
        if (!item) return ''
        return `${item.chkitemName} - ${item.evalCategoryName}`
      }
      if (courseId) {
        const item = this.checkTableList.find(i => i.courseId === courseId)
        if (!item) return ''
        return `${item.code} - ${item.courseName}`
      }
      if (scId) {
        const item = this.checkTableList.find(i => i.scId === scId)
        if (!item) return ''
        return `${item.scCode} - ${item.scName}`
      }
      if (tableId) {
        const item = this.checkTableList.find(i => i.tableId === tableId)
        if (!item) return ''
        return `${item.tableCode} - ${item.tableName}`
      }
      return ''
    },
    locationTypeRequired() {
      // 模块为质量，分块为 空鼓开裂 和 观感 时，质量下属分类必选
      const { modules, blocks } = this.form
      return modules === 'zl' && ['zl-kgkl', 'zl-gg'].includes(blocks)
    }
  },
  methods: {
    opened(item, checkTableList) {
      this.checkTableList = checkTableList
    },
    closed(){
      console.log("closed")
      this.$refs.form.resetFields()
      this.$emit('closed')
    }
  }
}
</script>
